For school I had to make a portfolio website, mostly for next years internships. Most classmates would use a
free website to design their
portfolio. I did this first as well. However, some things that I wanted to happen weren't able to happen without
payment. And I didn't want to pay a 'shady' website just for a few extra tools.
So I went to my dad and asked him what he thought I could do. He told me we could try to build our own website,
since he did this himself for my mom and his small company (they quit a while back). And so he tried telling me
the basics (he isn't a webdesigner or anything but he knew a bit about html).
So I tried, with a few Youtube tutorials to make my own website. I decided on a one page website because I
thought making more might make it more difficult for me.
I used one particular video where I liked the whole design. I've followed that tutorial to the core. I did
everything the same.
As of right now I only have the Hi! part (+ the colours) the same 'cause I still like those.
In my old website I felt very limited in what I could do myself. Since I've never done this before and I
thought it'd be extra cool to make my own website. And since I couldn't really use Youtube since I don't
know the right words that describe what I mean/ there weren't any tutorials about what I wanted to happen I
could only do so much.
I did find a few cool tricks, such as my Hi! text at the homepage. And a way to make my skills bar fill up every
5 seconds. So I did have a few cool things to show in the website. I just didn't feel the like it was complete.
And so I didn't reaally know what to do with my website.
I've been a fan of the singer from Nightwish, Floor Jansen, and seeing her website gave me a lot of inspiration
for my own portfolio website. Unfortunatly she recently updated her website, not for the better in my opinion,
so I can't show the URL I got inspired by.
Luckily I did make a few pictures for my "Portfolio Upgrade.pages" so
I have a few pictures. Underneath are my pages idea for the new website.
If you can't read it I'll explain it here shortly.
As I also wanted a Show reel with my old website, but failed because I didn't know how to do that. I managed to
get a friend from my dads to help me with my website, who is an actual webdesigner. He also looked at my idea
and helped me get a show reel behind my Hi! text. As Floor got something similair on her website, we could use
that to make my show reel shape, also with the fading to my website colour. I don't intend on having my header
following the scrolling as Floors website had. It's an interesting idea but I think for my smaller website it's
a bit unnecessary.
Even tho in the photo it talks about 'News' I used the same design for my 'Work'. I also used the same kind of
hover. Just in my pink colour instead of red. Even tho Floors doesn't have a big picture of the final result/
news picture but bigger, I did do that.
I used her same idea with showing the Title again, and the date. I
didn't want to use 'Last updated' since that's a bit much for my art.
However, I thought it was a pretty cool
idea to have a button both at the top as on the bottom where you'd check out the end result, on a new page. As
for the rest I used a bit of my own ideas to deisgn the page.
As I've had in my old website an About on my page, I liked the idea of getting that back. And even tho it's just
text that I can style a bit, I used Floors biography as a guideline.
Now I didn't know that if you scrolled further down you'd get to a timeline, in Floors website, so I thought
that's pretty interesting. I've also used a timeline as a summary of my CV. I first thought having such a line
down is interesting. But now I think it'd just be a lot of scrolling. So I've decided to use the timeline idea,
and change the style of portraying it. So instead I'm going to make the Title TIMELINE and then see pictures
from 2014 all the way to 2022.
Using the < and> you can go through the years. And if for example 2019 interests
you, you'd click on an image and you'd see the timeline as Floors.
As I've also haad an 'Skills' part in my oold website I decided to make a very new skill portrayal. I got
inspired by the way you can embed Spotify to your website. I initially wanted to make all the clickable blocks
softwares, the bar above it to show how long the song takes the bar that shows how much I know the software (and
with arrows former years), I also wanted the numbers 1. and the big picture to be the sooftware icon. These were
all sounding like very intense and a lot of time consuming ideas.
I also wanted to have the clickable blocks that weren't clicked on to move away from the box. This would then be
replaced by other woorks I did with the software I did click on.
I could imagine it very well, and I noticed
everyone around me I tried to explain this part wouldn't understand my image. So I tried it on Adobe
Illustrator, to... illustrate my idea. This led me to a discovery that I didn't like my idea at all on screen.
So I had to change my idea. This went quite easy as I already thought about this idea while making my original
idea in Illustrator.
Down here is my new idea. The pictures do not follow, completely, my website style-guide so don't mind those. I
wanted to show the beginning and end of when you click on Adobe After Effects, and the image in between.
The blocks you see in the right picture indicates all the projects I used this software with, from sketch all
the way to end result.
If you're curious about the old website you can click on the botton here called "Old Website".
